@charset "UTF-8";
/*公用 样式部分*/
body, ul, ol, p, h1, h2, h3, h4, h5, input, form, dl, dt, dd {
  margin: 0;
  padding: 0;
  font-size: 12px;
  -webkit-touch-callout: none; }

img {
  width: 100%;
  display: block;
  height: auto;
  max-width: 640px;
  margin: 0 auto;
  border: 0; }

ol, ul, dl {
  list-style: none; }

.hid {
  width: 0;
  height: 0;
  overflow: hidden;
  text-indent: -9999px;
  font-size: 0;
  display: block; }

em, i {
  font-style: normal; }

h1, h2, h3, h4, h5 {
  font-weight: normal; }

/*背景延展区域; 并通过background-size缩放背景图 ;取页面主色调做背景色*/
body {
  /*background: #f0f0f0;*/
  position: relative;
  /*color: #616161; */
  }

input {
  outline: none;
  border: none; }

body, input, select, textarea {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }

a, input, select, textarea, ul, li, dt, dd {
  -webkit-tap-highlight-color: rgba(255, 0, 0, 0);
  text-decoration: none; }

/*开启硬件加速*/
/* .css {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); }

html {
  font-size: 85.33px;
  min-height: 100%;
  -webkit-touch-callout: none; }

@media screen and (min-width: 360px) {
  html {
    font-size: 96px; } }

@media only screen and (min-width: 375px) {
  html {
    font-size: 100px; } }

@media only screen and (min-width: 400px) {
  html {
    font-size: 106.67px; } }

@media only screen and (min-width: 414px) {
  html {
    font-size: 110.4px; } }

@media only screen and (min-width: 480px) {
  html {
    font-size: 128px; } }

@media only screen and (min-width: 568px) {
  html {
    font-size: 151.47px; } }

@media only screen and (min-width: 640px) {
  html {
    font-size: 170.67px; } }

a:hover {
  cursor: pointer; }

a:active {
  background-color: #f4f0f0 !important; } */

/*wrap*/
.wrap {
  width: 100%;
  max-width: 570px;
  margin: 0 auto; }
  
  /* common */
.rela{position: relative;}
.abs{position: absolute;}
.fixed{position: fixed;}
.none{display: none;}
.block{display: block;}
.inline-b{display: inline-block;}
.fl{float:left;}
.fr{float:right;}
.oh{overflow:hidden;}
.oa{-webkit-overflow-scrolling:touch;}
.tl{text-align:left;}
.tc{text-align:center;}
.tr{text-align:right;}
.tj{text-align:justify;}
.vm{vertical-align:middle;}
.vt{vertical-align:top;}
.vb{vertical-align:bottom;}

.clear:after {
  content: ".";
  width: 0;
  height: 0;
  overflow: hidden;
  display: block;
  clear: both;
}

.bdr-bottom,
.bdr-top,
.bdr-left,
.bdr-right,
.bdr {
  position: relative;
}

.bdr-bottom:after {
  width: 100%;
  height: 1px;
  content: "";
  position: absolute;
  bottom: -1px;
  left: 0;
  z-index: 10;
  border-top: 1px solid #e0e0e0;
  transform: scaleY(0.5);
  -webkit-transform: scaleY(0.5);
}

.bdr-top:before {
  width: 100%;
  height: 1px;
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  z-index: 10;
  border-bottom: 1px solid #e0e0e0;
  transform: scaleY(0.5);
  -webkit-transform: scaleY(0.5);
}

.bdr-right:before {
  width: 1px;
  height: 100%;
  content: "";
  position: absolute;
  top: 0;
  right: -1px;
  z-index: 10;
  border-left: 1px solid #e0e0e0;
  transform: scaleX(0.5);
  -webkit-transform: scaleX(0.5);
}

.bdr-left:before {
  width: 1px;
  height: 100%;
  content: "";
  position: absolute;
  top: 0;
  left: -1px;
  z-index: 10;
  border-right: 1px solid #e0e0e0;
  transform: scaleX(0.5);
  -webkit-transform: scaleX(0.5);
}

.bdr:before {
  position: absolute;
  content: "";
  border: 1px solid #808080;
  border-radius: 2px;
  left: 0;
  top: 0;
  pointer-events: none;
  -webkit-transform: scale(0.5);
  -webkit-transform-origin: 0 0;
  -webkit-box-sizing: border-box;
  width: 200%;
  height: 200%;
}

.center {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
/*toast S*/
#putao-toast-tip {
    opacity: 0;
    pointer-events: none;
    position: fixed;
    top: 50%;
    left: 0;
    width: 100%;
    text-align: center;
    z-index: 10000;
}
.transition-opacity {
    -webkit-transition: opacity 1s;
    -moz-transition: opacity 1s;
    -ms-transition: opacity 1s;
    -o-transition: opacity 1s;
    transition: opacity 1s;
}
.toast-content {
    max-width: 80%;
    padding: 10px;
    display: inline-block;
    color: #ffffff;
    background-color: #000000;
    opacity: 0.6;
    font-size: 16px;
    line-height: 1.4;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}
/*Loading S*/
.spinner {
    position: fixed;
    top: 50%;
    width: 100%;
    text-align: center;
    z-index: 1000000;
}
.spinner img{
    width: 20px;
}
input{
    -webkit-user-select:auto;
}


